<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <div id="myclientkey"></div>  
  <script src="https://cdn.bootcss.com/socket.io/2.3.0/socket.io.dev.js"></script>

<script src="./buffer.js"></script>

  <script>
    let Buffer = window.buffer.Buffer
    

var saveData = (function () {
    var a = document.createElement("a");
    document.body.appendChild(a);
    a.style = "display: none";
    return function (blob, fileName) {
        var url = window.URL.createObjectURL(blob);
        a.href = url;
        a.download = fileName;
        a.click();
        window.URL.revokeObjectURL(url);
    };
}());


class SaveFile {
  constructor() {
    this.uuid = 'acd' + Date.now()
    this.data = []
  }
  append(blob) {
    this.data.push(Buffer.from(blob))
  }
  getValue() {
    return  Buffer.concat(this.data);
  }
}


    let socket
    socket = io('192.168.1.2:3200')


    socket.on('myclient', function (data) {
      myclientkey.innerHTML = data
  })
    

  socket.emit('conneted', 'world');

  let currentSaveFile = null
  socket.on('file-send', function (httpData) {

    if (httpData.isFirst) {
      currentSaveFile = new SaveFile()
    }

    if (httpData.isEnd) {
      currentSaveFile.append(httpData.slice)
      let value = currentSaveFile.getValue()
      saveData(new Blob([value], { type: httpData.type }), 'test')
    } else {
      currentSaveFile.append(httpData.slice)
    }

  })

  </script>
</body>
</html>